<!DOCTYPE html>
<html lang="">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>fileHome</title>

    <script src="../public/vue/dist/vue.min.js"></script>
    <!-- Bootstrap CSS -->
    <link href="../public/bootstrap/dist/css/bootstrap.css" rel="stylesheet">
    <!-- jQuery -->
    <script src="../public/jquery/dist/jquery.min.js"></script>
    <!-- Bootstrap JavaScript -->
    <script src="../public/bootstrap/dist/js/bootstrap.min.js"></script>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.3/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>

<div class="jumbotron">
    <div class="container text-center">
        <h1>express http file Server</h1>
        <p>test It now ...</p>

    </div>
</div>


<div class="container-fluid" id="fileApp">


    <a class="btn btn-primary" href="/files/toUpload" role="button">添加文件</a>


    <div class="row">

        <ul class="list-group">
            <li class="list-group-item" v-for="(item, index) in fileList" :key="index">

                <a :href="'/files/download?id=' + item " target="_blank"> {{item}} </a>
            </li>

        </ul>


    </div>

</div>


</body>
</html>

<script>

    var vm = new Vue({
        el: '#fileApp',
        data: {
            fileList: []
        },
        methods: {
            details: function () {
                return this.site + " - 学的不仅是技术，更是梦想！";
            },
            all: function () {

                var _self = this;
                $.ajax({
                    type: "get",
                    url: "/files",
                    // data: "data",
                    dataType: "json",
                    success: function (response) {
                        console.log(response);
                        if (response.code == 0) {

                            _self.fileList = response.dat;
                        }

                    }
                });
            }
        },
        mounted: function () {

            this.all();
        }
    })
</script>